import 'package:flutter/material.dart';

class GridViewBuidlerCase extends StatefulWidget {

  const GridViewBuidlerCase({super.key});

  @override
  _GridViewBuilderCase createState() => _GridViewBuilderCase();
}

class _GridViewBuilderCase extends State<GridViewBuidlerCase> {
  List<int> list = [];

 // 获取数据
  getData () async {
   await Future.delayed(const Duration(seconds: 1));
   setState(() {
        list.addAll([1,2,3,4,5,6,7]); // 响应式更新
   });
   await Future.delayed(const Duration(seconds: 2));
    setState(() {
        list.addAll([8,9, 10, 11,34]); // 响应式更新
   });
  }
  @override
  void initState() {
    // TODO: implement initState
    // 初始化数据
    getData();
    super.initState();
  }

 Widget getGridViewItem (int index) {
  return Container(
    color: index % 2 == 0 ? Colors.amber : Colors.blueAccent,
    alignment: Alignment.center,
    child: Text("第${list[index]}个"),
  );
 }
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(10),
       child: GridView.builder(
        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3, // 交叉轴上的数量
          mainAxisSpacing: 10, // 主轴间距
          crossAxisSpacing: 10, // 交叉轴间距
          childAspectRatio: 1 // 元素宽高比
          ),
       itemBuilder: (BuildContext context , int index) {
         return getGridViewItem(index);
       },
       itemCount: list.length,
       ),
    );
  }
}